﻿<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html" ; charset="utf-8" />
    <title>教务信息查询</title>
    <link href="../../../css/main.css" rel="stylesheet" type="text/css" />
    <link
      href="../../../bstable/css/bootstrap.min.css"
      rel="stylesheet"
      type="text/css"
    />
    <link
      href="../../../bstable/css/bootstrap-table.css"
      rel="stylesheet"
      type="text/css"
    />
    <link href="../../../css/new.css" rel="stylesheet" type="text/css" />
  </head>

  <body>
    <div style="padding: 20px">
      <div class="p_line text_ient lx-row ptb10">
        <div class="col lx-col-50">
          <a class="find_a">缴费凭证：</a>
          <p class="img-con front-con">
            <img src="" />
            <b class="del-img">❌</b>
          </p>
          <input id="jiaofei" type="file" class="input-file" accept="image/*" />
        </div>
      </div>
      <div class="p_line text_ient lx-row ptb10">
        <div class="col lx-col-50">
          <a class="find_a">优惠凭证：</a>
          <p class="img-con front-con">
            <img src="" />
            <b class="del-img">❌</b>
          </p>
          <input id="youhui" type="file" class="input-file" accept="image/*" />
        </div>
      </div>
      <div class="p_line text_ient lx-row ptb10">
        <div class="col lx-col-50">
          <a class="find_a">其他证明：</a>
          <p class="img-con front-con">
            <img src="" />
            <b class="del-img">❌</b>
          </p>
          <input id="qita" type="file" class="input-file" accept="image/*" />
        </div>
      </div>
      <div>
        <input
          type="button"
          value="上传"
          class="but_find"
          id="upload"
          style="width: 60px; margin: 20px 0 0 97px"
        />
      </div>
    </div>

    <div class="big-img" style="display: none">
      <img src="" alt="" />
    </div>

    <script src="../../../js/jquery.js"></script>
    <script src="../../../js/common.js"></script>
    <script src="../../../layer_v2.1/layer/layer.js"></script>
    <script src="../../../js/laydate-master/laydate.js"></script>
    <script src="../../../bstable/js/bootstrap.min.js"></script>
    <script src="../../../bstable/js/bootstrap-table.js"></script>
    <script src="../../../bstable/js/bootstrap-table-zh-CN.min.js"></script>
    <script type="text/javascript">
      function bigShow(src) {
        $(".big-img img").attr("src", src);
        $(".big-img").show();
      }
      $(".big-img").on("click", function () {
        $(".big-img").hide();
      });

      if (getQuery("from") === "student") {
        localStorage.setItem("name", "学生管理/学生信息查询/凭证上传");
      } else if (getQuery("from") === "fenqi") {
        localStorage.setItem("name", "学生管理/分期缴费信息查询/凭证上传");
      }

      function getQuery(variable) {
        var query = window.location.search.substring(1);
        var vars = query.split("&");
        for (var i = 0; i < vars.length; i++) {
          var pair = vars[i].split("=");
          if (pair[0] == variable) {
            return pair[1];
          }
        }
        return false;
      }
      var idNo = getQuery("idNo");
      var trainType = getQuery("trainType");
      // getUserInfo()
      function getUserInfo() {
        $.ajax({
          url: baseUrl + "studentInfo/getStudentInfo",
          method: "get",
          headers: {
            Authorization: JSON.parse(localStorage.getItem("userInfo")).token,
          },
          data: {
            trainType,
            idNo,
          },
          success: function (data) {
            var cards = data.studentCards;
            var maps = ["jiaofei", "youhui", "qita"];
            cards.forEach(function (item) {
              if (maps.includes(item.property)) {
                $("#" + item.property).hide();
                $("#" + item.property)
                  .siblings("p")
                  .css("display", "inline-block")
                  .find("img")
                  .attr(
                    "src",
                    baseUrl +
                      "studentInfo/picDownload?url=" +
                      encodeURIComponent(item.fileResource)
                  );
              }
            });
          },
        });
      }

      $(".input-file").on("change", function () {
        var files = this.files;
        var id = $(this).attr("id");
        if (files.length) {
          $(this).hide();
          $(this).siblings(".img-con").css("display", "inline-block");
          drawImg($(this).siblings(".img-con").find("img"), files[0]);
        }
      });
      $(".del-img").on("click", function () {
        $(this).siblings("img").attr("src", "");
        $(this).parents(".img-con").hide().siblings(".input-file").show();
        $(this).parents(".img-con").siblings(".input-file")[0].value = "";
      });
      function drawImg($el, file) {
        var URL = window.URL || window.webkitURL;
        var imgUrl = URL.createObjectURL(file);
        $el.attr("src", imgUrl);
      }

      var studentId = getQuery("id");
      var userId = JSON.parse(localStorage.getItem("userInfo")).userId;
      $("#upload").on("click", function () {
        var files = [];
        $(".input-file").each(function (index) {
          if (this.files.length) {
            files.push({
              file: this.files[0],
              key: $(this).attr("id"),
            });
          }
        });

        var flag = false;
        $(".img-con img").each(function (item) {
          if ($(this).attr("src")) {
            flag = true;
          }
        });

        if (!files.length && !flag) {
          alert("请至少选择一种凭证");
          return;
        }
        // 更新
        if (!files.length && flag) {
          return postAjax();
        }
        var i = 0;
        // files.forEach(function(file) {
        var formData = new FormData();
        formData.append("trainType", trainType);
        formData.append("studentId", studentId);
        formData.append("studyId", getQuery("studyId"));
        formData.append("userId", userId);
        files.forEach(function (item, index) {
          formData.append("propertys", item.key);
          formData.append("files", item.file);
          //   formData.append("studentId", studentId);
          //   formData.append("studyId", getQuery("studyId"));
          //   formData.append("userId", userId);
        });
        $.ajax({
          url: baseUrl + "studentInfo/uploadStuCertificate",
          method: "post",
          data: formData,
          headers: {
            Authorization: JSON.parse(localStorage.getItem("userInfo")).token,
          },
          processData: false,
          contentType: false,
          mimeType: "multipart/form-data",
          success: function (data) {
            postAjax();
          },
        });
        // })
      });

      function postAjax() {
        $.ajax({
          url: baseUrl + "studentInfo/addPz",
          method: "post",
          data: {
            studentId: studentId,
            userId: userId,
            commitFlag: 2,
            studyId: getQuery("studyId"),
          },
          headers: {
            Authorization: JSON.parse(localStorage.getItem("userInfo")).token,
          },
          success: function (data) {
            alert("上传成功");
            if (getQuery("from") === "student") {
              location.href = "./studentSearch.html";
            } else if (getQuery("from") === "fenqi") {
              location.href = "./paySearch.html";
            }
          },
        });
      }

      $(".img-con img").on("click", function () {
        var src = $(this).attr("src");
        if (src.endsWith("pdf")) {
          src = encodeURIComponent(location.origin + src);
          window.open("../../pdf/web/viewer.html?file=" + src);
        } else {
          bigShow(src);
        }
      });
    </script>
  </body>
</html>
<!-- 
layer.photos({
    photos: json //格式见API文档手册页
    ,anim: 5 //0-6的选择，指定弹出图片动画类型，默认随机
  }); -->
